import React, {Component} from 'react'
import { Tabs } from 'antd';
import ListUserPage123 from './List';
import ListInfo from './Info';
import Actions from './ActionStore/Actions';
import ActionsGlobal from '../../actions';

const TabPane = Tabs.TabPane;

export default class ListAndTabs extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            activeKey: '1',
            rowObj: null,
            matchedRows: '', //table列表需要选中的行
        };

        // this.unsubscribe = store.listen( (type, data)=>{
        //     console.log("store.listen   type====", type);
        //     console.log("store.listen   data====", JSON.stringify(data));
        //     this.setState(data);
        // });
        this.unsubscribe = Actions.rowDoubleClick.listen( (type, rowObj) => {
            this.setState({
                activeKey: type,
                rowObj: rowObj[0].data,
                matchedRows: rowObj[0].rowIndex,
            });
        });
        this.unsubscribe2 = ActionsGlobal.pageElementChange.listen( () => {
            ////TableList 列表点击分页、每页显示多少条时的监听，用来解决点击分页时把默认选中的数据去掉
            this.setState({
                rowObj: null,
                matchedRows: '',
            });
        });
    }

    componentWillUnmount() {
        console.log("组件销毁");
        this.unsubscribe();
        this.unsubscribe2();
    }

    onChangeTabs =(key) => {
        this.setState({
            activeKey: key
        });
    };

    render() {
        let listInfo, loginName;
        if(this.state.rowObj != null){
            loginName = this.state.rowObj.loginName;
            listInfo = (
                <TabPane ref="infoTabPane" tab="明细" key="2" >
                    <ListInfo loginName={loginName} />
                </TabPane>
            )
        }else{
            listInfo = (
                <TabPane ref="infoTabPane" disabled tab="明细" key="2" >
                    <ListInfo loginName={loginName} />
                </TabPane>
            )
        }
        return (
            <Tabs onChange={this.onChangeTabs} activeKey={this.state.activeKey}>
                <TabPane tab="数据列表" key="1">
                    <ListUserPage123 matchedRows={this.state.matchedRows}/>
                </TabPane>
                {listInfo}
            </Tabs>
        );
    }
}
